<template>
    <div class="app-container">
      <el-tabs v-model="activeName" type="card" @tab-click="getList">
        <el-tab-pane label="建筑物" name="0"></el-tab-pane>
        <el-tab-pane label="生命线工程" name="1"></el-tab-pane>
      </el-tabs>
  
      <!-- <h2>按条件模糊查询</h2> -->
      <el-form :model="queryParams" ref="queryRef" :inline="true">
        <el-form-item label="选择查询条件" prop="code">
          <el-select v-model="queryParams.code" clearable @change="codeChange">
            <el-option value="1" label="按任务编号"></el-option>
            <el-option value="0" label="按行政区划" v-if="activeName == '0'"></el-option>
            <!-- <el-option value="2" label="按备注说明"></el-option> -->
            <el-option value="2" label="按创建人"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label=" " prop="info">
          <el-input v-model="queryParams.info" clearable></el-input>
        </el-form-item>
        <el-form-item label=" ">
          <el-button type="primary" @click="getList">查询</el-button>
        </el-form-item>
      </el-form>
  
      <el-table :data="dataList" v-loading="loading" stripe>
        <template v-if="activeName == '0'">
          <el-table-column label="任务编号" prop="assessCode" align="center"></el-table-column>
          <el-table-column label="评估方法" prop="assessType" align="center">
            <template #default="{ row }">
              {{ assessType.find(item => item.value == row.assessType)?.name }}
            </template>
          </el-table-column>
          <el-table-column label="评估内容" prop="assessObj" align="center">
            <template #default="{ row }">
              {{ row.assessObj?.split(',').map(obj => assessObj.find(item => item.value == obj)?.name).join('、') }}
            </template>
          </el-table-column>
          <el-table-column label="危险性数据" prop="desc" align="center">
            <template #default="{ row }">
              <span>
                {{
                  row.seismicInputMode?.split(',').map(item => inputMethods(row.assessType == '0' ? 'confirm' :
                    'probability').find(cur => cur.value == item)?.name).join('、')
                }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="创建人" prop="createUserName" align="center"></el-table-column>
        </template>
        <template v-if="activeName == '1'">
          <el-table-column label="任务编号" prop="code" align="center" />
          <el-table-column label="评估内容" prop="evaluationObject" align="center" />
          <el-table-column label="危险性数据" prop="inputMethod" align="center" />
          <el-table-column label="创建人" prop="userName" align="center" />
        </template>
        <el-table-column label="评估图件" align="center" width="140px">
          <template #default="{ row }">
            <el-button type="text" @click="downloadImg(row.id)">下载</el-button>
          </template>
        </el-table-column>
      </el-table>
  
      <pagination style="margin-top: 15px" v-show="total > 0" :total="total" v-model:page="paginationData.page"
        v-model:limit="paginationData.rows" @pagination="getList" />
    </div>
  </template>
  <script setup>
  import { getFuzzyPage, getFuzzyLifePage, downloadMaps } from '@/api/searchExport/calculateExport'
  import { assessType, assessObj, inputMethods } from '@/views/building'
  
  const activeName = ref('0')
  const queryParams = ref({ code: '1' })
  const codeChange = () => {
    queryParams.value.info = ''
  }
  
  const dataList = ref([])
  const loading = ref(false)
  const paginationData = ref({
    page: 1,
    rows: 10
  })
  const total = ref(0)
  
  const getList = () => {
    const { code, info } = queryParams.value
    const params = {}
    switch (code) {
      case '1':
        params.assessCode = info
        break;
      case '0':
        params.pcc = info
        break;
      case '2':
        params.createUserName = info
        break;
      case '3':
        params.createUserName = info
        break;
      default:
        break;
    }
    loading.value = true
    debugger
    if (activeName.value == '0') {
      getFuzzyPage({ ...params, ...paginationData.value }).then(res => {
        if (res.code == 200) {
          loading.value = false
          dataList.value = res.data?.rows || []
          total.value = res.data?.total || []
        }
      }).catch(() => loading.value = false)
    } else if (activeName.value == '1') {
      getFuzzyLifePage({ code: code, info, ...paginationData.value }).then(res => {
        if (res.code == 200) {
          loading.value = false
          dataList.value = res.data?.rows || []
          total.value = res.data?.total || 0
        }
      }).catch(() => loading.value = false)
    }
  }
  
  const downloadImg = id => {
    let params = {
      assessId: id,
      dataType: activeName.value == '0' ? '1' : '2'
    }
    downloadMaps(params).then(response => {
      let blob = new Blob([response], { type: 'application/zip' })
      let url = window.URL.createObjectURL(blob)
      const link = document.createElement('a')
      link.href = url
      link.download = `${activeName.value == '0' ? '建筑物' : '生命线工程'}-评估图件`
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
    })
  }
  
  onMounted(() => {
    getList()
  })
  </script>